import Layout from '@components/layout';
import WorkList from '@components/WorkList';
import { Get as UserGet } from '@lib/api/user';
import * as WorkApi from '@lib/api/work';
import { ICategory, IUser, IWork } from '@lib/types';
import { Button } from 'antd';
import * as React from 'react';
import { connect } from 'react-redux';

interface IViewState {
	user: IUser;
	work: IWork[];
}

interface IViewProps {
	user: IUser;
	work: IWork[];
	category: ICategory[];
}

class View extends React.Component<IViewProps, IViewState> {
	static async getInitialProps(param: any) {
		const id = param.query.id;
		const user = await UserGet(id);
		const res = await WorkApi.User(id);
		if (res instanceof Error || user instanceof Error) {
			return;
		}
		return {
			user: user.user,
			work: res.list
		};
	}
	constructor(props: any) {
		super(props);
		this.state = {
			user: this.props.user,
			work: this.props.work
		};
	}
	public renderSocial() {
		const res = [];
		if (this.state.user.bilibili_id) {
			res.push(<Button href={`https://space.bilibili.com/${this.state.user.bilibili_id}`} target="_blank" rel="nofollow" key="bilibili"><i className="iconfont icon-bilibili"></i> Bilibili</Button>);
		}
		if (this.state.user.nga_id) {
			res.push(<Button href={`https://bbs.nga.cn/nuke.php?func=ucp&uid=${this.state.user.nga_id}`} target="_blank" rel="nofollow"><i className="iconfont icon-nga" key="nga"></i> NGA</Button>);
		}
		if (this.state.user.weibo_id) {
			res.push(<Button href={`https://weibo.com/${this.state.user.weibo_id}`} target="_blank" rel="nofollow" key="weibo"><i className="iconfont icon-weibo"></i> 微博</Button>);
		}
		return (<Button.Group style={{
			float: "right"
		}}>{res}</Button.Group>);
	}
	public render() {
		return (
			<Layout className="page-work-list" title={this.state.user.name}>
				<h1>{this.state.user.name} {this.renderSocial()}</h1>
				<WorkList list={this.state.work} hide_user={true} />
			</Layout>
		);
	}
}

const mapStateToProps = (state: any) => ({
	category: state.category
});

export default connect(mapStateToProps)(View);